<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>模型列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/css/user.css" media="all" />
    <link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_1041315_n1zmpydjv1.css">
</head>
<body class="childrenBody">
<fieldset class="layui-elem-field">
    <legend>流程查询</legend>
    <div class="layui-field-box">
        <form class="layui-form">
            <div class="layui-form toolbar">
                模型名称：
                <div class="layui-input-inline">
                    <input type="text" class="layui-input searchVal" name="deploymentId" placeholder="请输入部署id" />
                </div>
                key：
                <div class="layui-input-inline">
                    <input type="text" class="layui-input searchVal" name="name" placeholder="请输入流程名称" />
                </div>
            <div class="layui-input-inline">
                <a class="layui-btn" lay-submit="" lay-filter="searchForm"><i class="iconfont icon-sousuo2"></i>查询</a>
            </div>
            </div>
        </form>
    </div>
    <div class="layui-col-md12">
        <div class="layui-btn-group">
<!--            <button class="layui-btn layui-btn-normal" data-type="syncdata">-->
<!--                <i class="layui-icon">&#xe618;</i>同步数据-->
<!--            </button>-->
        <button class="layui-btn layui-btn-normal" id="processGroup" data-type="add">
            <i class="iconfont icon-xinzeng"></i>新建流程
        </button>
    </div>
    </button>
    </div>
</fieldset>
<div class="layui-form users_list">
    <table class="layui-table" id="actModelList" lay-filter="act"></table>

    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-xs" lay-event="edit" ><i class="iconfont icon-xiugai"></i>编辑</a>
        <a class="layui-btn layui-btn-xs" lay-event="deply" ><i class="iconfont icon-fabu"></i>发布</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="iconfont icon-shanchu"></i>删除</a>
    </script>
</div>
<div id="page" style="text-align: center;"></div>
<script type="text/javascript" src="/layui/layui.js"></script>
<script type="text/javascript" src="/js/tools.js?t=1"></script>
<script   type="text/javascript"  th:inline="none">
    var $,common;
    layui.config({
        base: '/js/common/' //假设这是你存放拓展模块的根目录
    }).use(['layer','form','table','laypage','common'], function() {
        var layer = layui.layer,
            $ = layui.jquery,
            form = layui.form,
            laypage=layui.laypage,
            common=layui.common,
            table = layui.table;
        //表格变量

        table.render({
            elem: '#actModelList',
            even: true,
            url: 'showAm',
            method: 'get',
            id:'actModelList',
            page: false,
            loading: true,
            width: $(parent.window).width() - 223,
            cols: [[
            {checkbox: true, fixed: true, width: '5%'}
            , {field: 'id', title: '编号', width: '15%', sort: true}
            , {field: 'name', title: '流程名称', width: '15%', sort: true}
            , {field: 'key', title: 'key', width: '12%', sort: true}
            , {field: 'version', title: '版本', width: '5%', sort: true}
            ,  {
                    field: 'createTime',
                    title: '创建时间',
                    width: '10%',
                    templet: '<div>{{ layui.laytpl.toDateString(d.createTime) }}</div>',
                    unresize: true
                }
            , {field: 'text', title: '操作', toolbar:'#barDemo'}

        ]],
            done: function(res, curr, count){
                //pages=res.page;
                counts=res.count;
                //完整功能
                laypage.render({
                    elem: 'page'
                    ,count: counts,
                    first: '首页',
                    last: '尾页'
                    ,layout: ['count', 'prev', 'page', 'next',  'refresh', 'skip']
                    ,theme: '#00A0E9'
                    ,curr: curr
                    ,skip: true
                    ,jump: function(obj,first){
                        curr = obj.curr;

                        if(!first){
                            getData(obj.curr,obj.limit)
                        }
                    }
                });

            }

        });

        function getData(page,limit){
            $.ajax({
                type: 'post',
                url: 'showAct?page='+page+"&limit="+limit,
                async: false,
                success: function (data) {
                    $(".layui-laypage-btn").click();
                    table.reload('actModelList',{
                        data : data,
                        page:{
                            curr:page
                        }
                    });

                }
            });
        }

        //监听工具条
        table.on('tool(act)', function(obj){
            var data = obj.data;
            if(obj.event === "del"){
                layer.confirm("你确定要删除？",{btn:['是的,我确定','我再想想']},
                    function(){
                        $.post("delModel",{"id":data.id},function (res){
                            if(res.success){
                                layer.msg("删除成功",{time: 1000},function(){
                                    table.reload('actModelList');
                                });
                            }else{
                                layer.msg(res.message);
                            }

                        });
                    }
                )
            }else if (obj.event === "deply") {
                    $.post("open",{"id":data.id},function (res){
                        if(res.success){
                            layer.msg("发布成功",{time: 1000},function(){
                                table.reload('actModelList');
                            });
                        }else{
                            layer.msg(res.message);
                        }

                    });
                }else if (obj.event === "edit"){
                var index =layer.open({
                    id: 'act-update',
                    type: 2,
                    area: ['600px','350px'],
                    fix: false,
                    maxmin: true,
                    shadeClose: false,
                    shade: 0.4,
                    title: '编辑流程',
                    content: 'actUpdate/'+data.id
                });
                layer.full(index);
            }
        });
        //添加用户
        $("#processGroup").click(function () {
            var index =layer.open({
                id: 'act-add',
                type: 2,
                area: ['600px','350px'],
                fix: false,
                maxmin: true,
                shadeClose: false,
                shade: 0.4,
                title: '添加流程',
                content: 'goActiviti'
            });
            layer.full(index);
        })
        //搜索
        form.on("submit(searchForm)",function(){
            var deploymentId = $('#deploymentId').val();
            var name = $('#name').val();
            table.reload('actModelList', {where: {
                    deploymentId: deploymentId,
                    name: name
                }
            });
        });

    });
</script>
</body>
</html>